<template>
  <mu-flex justify-content="center" class="page">
    <mu-pagination raised circle :total="total" @change="changePage" :current.sync="current" :page-size="pagesize ? pagesize : 4">
    </mu-pagination>
  </mu-flex>
</template>
<script>
  import Axios from "axios";
  import Qs from 'qs'
  export default {
    props: ['value', 'action', 'search', 'currentChange', 'pageQuery'],
    data() {
      return {
        current: 1,
        total: 1,
        pagesize: ''
      }
    },
    computed: {
      pageData: {
        get: function () {
          return this.value
        },
        set: function (e) {
          console.log(e)
          this.$emit('input', e)
        }
      }
    },
    methods: {
      queryData(page) {
        let that = this;
        if (!that.action) {
          alert('====')
        } else {
          // let page = 1;
          let searchData = this.search || {};
          searchData.pageindex = page || 1;
          searchData.sortname = (!!searchData.sortname || searchData.sortname === '') ? searchData.sortname : 'addtime';
          searchData.sortorder = searchData.sortorder || 'desc';
          searchData.pagesize = searchData.pagesize || '5';

          Axios.get(this.action, {
              params: searchData
            }).then(res => {
              if (res.data.tdata.code === 'pglist') {
                that.pageData = res.data.tdata.rows;
                that.total = res.data.tdata.total;
              }
            })
            .catch(error => {

            })
        }
      },
      changePage(e){
        this.queryData(e);
      }
    },
    mounted() {
      this.queryData();
    }
  }
</script>
<style lang="less">
  .mu-pagination-item.mu-button.is-current {
    background-color: #f18241
  }
  .page{
    margin: 15px 0;
  }
</style>